<template>
  <el-select :filterable="filterable" v-model="code" :disabled="disabled" :placeholder="placeholderName" style="width: 100%" clearable @change="$emit('input',code);$emit('change',code);$emit('name',name);" @focus="getData">
    <el-option v-for="(x,index) in typeList" :key="index" :label="x.name" :value="x.code"/>
  </el-select>
</template>

<script>
// import { pccApi } from '@/api/carManage/api' // 模块js引用
import request from '@/utils/request'
export default {
  name: 'SelectOption',
  props: {
    filterable: {
      type: Boolean,
      default: false
    },
    disabled: Boolean,
    value: [String, Number, Boolean],
    type: {
      type: String,
      default: null
    },
    api: {
      type: String,
      default: '/pcc/core/biz/getCurrTypeValList'
    },
    placeholder: {
      type: String,
      default: '请选择'
    },
    label: String,
    dataSource: {
      type: String,
      default: null
    }
  },
  data() {
    return {
      code: '',
      data: []
    }
  },
  computed: {
    typeList() {
      if (this.type && this.$store.state.baseData[this.type].length > 0) {
        return this.$store.state.baseData[this.type]
      } else if (this.dataSource) {
        return JSON.parse(this.dataSource)
      }
    },
    name() {
      // console.log(this.code);

      return this.codeToName(this.code, this.typeList)
    },
    propsValue() {
      this.code = this.value
      return this.value
    },
    placeholderName() {
      const label = this.label ? this.label : ''
      return '请选择' + label
    }
    // dataSourceArray() {
    //   if (this.dataSource) {
    //     return JSON.parse(this.dataSource);
    //   } else {
    //     return [];
    //   }
    // }
  },
  watch: {
    value(val) {
      this.code = val
    },
    propsValue(val) {
      // console.log(val);
      this.code = val
    }
  },
  mounted() {
    this.$nextTick(() => {
      this.code = this.value
      this.getData()
    })
  },
  methods: {
    getData() {
      // console.log(this.type,this.$store.state.baseData[this.type],this.$store.state.baseData[this.type].length);
      if (this.$store.state.baseData[this.type]) {
        if (this.$store.state.baseData[this.type].length <= 0) {
          this.getBaseData(this.type)
        }
      }
    },
    getBaseData(typeCode) {
      request({
        url: this.api,
        method: 'post',
        data: {
          typeCode: this.type,
          version: 'latest'
        }
      }).then(res => {
        if (res.code === 0) {
          this.$store.commit(typeCode, res.data)
        } else {
          this.$message.error(res.msg)
        }
      })
      /*     pccApi.getCurrTypeValList(typeCode).then(res => {
        if (res.returnCode === '0000') {
          this.$store.commit(typeCode, res.data)
        } else {
          this.$message.error(res.msg)
        }
      })*/
    },
    codeToName(code, array) {
      let name = null
      if (array && array.length > 0) {
        array.forEach(x => {
          if (x.code === code) {
            name = x.name
          }
        })
      }
      return name
    }
  }
}
</script>
